<template>
  <div>
    <div role="alert" class="el-alert el-alert--info is-light">
      <i class="el-alert__icon el-icon-info" />
      <div class="el-alert__content">
        <span
          class="el-alert__title"
        >对公司名称、公司地址、营业执照、公司地区的更新，将使得公司资料被重新审核，请谨慎修改</span><!----><!----><i
          class="el-alert__closebtn el-icon-close"
          style="display: none"
        />
      </div>
    </div>

    <el-row style="margin-top: 50px;">
      <el-col :span="8">
        <el-form ref="form" :model="companyForm" label-width="80px" disabled>
          <el-form-item label="公司名称">
            <el-input v-model="companyForm.name" />
          </el-form-item>

          <el-form-item label="公司地址">
            <el-input v-model="companyForm.companyAddress" />
          </el-form-item>

          <el-form-item label="公司邮箱">
            <el-input v-model="companyForm.mailbox" />
          </el-form-item>

          <el-form-item label="备注">
            <el-input v-model="companyForm.remarks" type="textarea" rows="3" />
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import { getCompanyDetail } from '@/api/setting'
import { getDepartments } from '@/api/departments'
export default {
  data() {
    return {
      companyForm: {
        name: '',
        companyAddress: '',
        mailbox: '',
        remarks: ''
      }
    }
  },

  created() {
    this.getCompanyDetail()
  },

  methods: {
    async getCompanyDetail() {
      const { companyId } = await getDepartments()
      const { name, companyAddress, mailbox, remarks } = await getCompanyDetail(
        companyId
      )
      this.companyForm = { name, companyAddress, mailbox, remarks }
    }
  }
}
</script>

<style>
</style>
